﻿<!--
Copyright (c) Microsoft Corporation. All rights reserved
-->

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <title></title>
    <script src="/js/scenario8_pairdevice.js"></script>
    <script src="/js/displayhelpers.js"></script>
</head>

<body class="win-type-body">
    <div id="resultsViewTemplate" data-win-control="WinJS.Binding.Template">
        <div style="padding:2px; border:1px solid gray; white-space:nowrap">
            <div>Name: <span data-win-bind="innerText: name" style="font-weight:bold"></span></div>
            <div>Id: <span data-win-bind="innerText: id"></span></div>
            <div>CanPair: <span data-win-bind="innerText: canPair"></span></div>
            <div>IsPaired: <span data-win-bind="innerText: isPaired"></span></div>
        </div>
    </div>

    <div id="scenarioView">
        <div>
            <h2 id="sampleHeader" class="win-type-subheader">Description:</h2>
            <div id="scenarioDescription">
                This scenario demonstrates how to perform basic pairing. Basic pairing allows you to tell Windows which device you want paired, and then Windows will 
                handle the ceremony and the UI. If you want to display your own UI and be involved in the pairing ceremony, please see the Custom Pairing scenario.
                <br>This method can be used to pair devices like WiFiDirect, WSD, UPnP, Bluetooth or Bluetooth LE devices.
                <br>Pairing can only be performed on DeviceInformation objects of kind DeviceInformationKind.AssociationEndpoint.
            </div>
        </div>
        <div id="scenarioContent">
            <p>
                Choose a device selector:
                <br>
                <select id="selectorComboBox" class="win-dropdown"></select>
            </p>
            <button id="startWatcherButton" class="win-button">Start Watcher</button>
            <button id="stopWatcherButton" disabled="true" class="win-button">Stop Watcher</button>
            <button id="pairButton" disabled="true" class="win-button">Pair Selected Device</button>
            <button id="unpairButton" disabled="true" class="win-button">Unpair Selected Device</button>
        </div>
        <div id="resultsListView" style="border:2px solid white;" data-win-control="WinJS.UI.ListView" data-win-options="{
                itemTemplate: select(&apos;#resultsViewTemplate&apos;),
                layout: {type: WinJS.UI.ListLayout},
                tapBehavior: &apos;toggleSelect&apos;,
                selectionMode: &apos;single&apos;}">
        </div>
    </div>
</body>

</html>